<!--
 * @Description: 
 * @Date: 2024-05-16 10:26:27
 * @LastEditTime: 2024-08-26 09:19:53
-->
<route lang="json5">
{
  style: {
    navigationBarTitleText: '审核记录详情',
    navigationBarTextStyle: 'white', //标题栏字体颜色
    navigationBarBackgroundColor: '#0063AF', //标题栏背景色(纯色)
  },
}
</route>
<template>
  <view class="recordDetail w-screen bg-#F4F5F9">
    <view class="py-20rpx px-30rpx bg-#E9F3FF" v-if="shenheShow">审核处理</view>
    <view class="px-30rpx py-20rpx" v-if="shenheShow">
      <wd-cell title="审核结果" vertical prop="content">
        <view class="flex gap-20rpx">
          <wd-checkbox v-model="model.accept" @change="handleAccept">通过</wd-checkbox>
          <wd-checkbox v-model="model.reject" @change="handleReject">驳回</wd-checkbox>
        </view>
      </wd-cell>
      <wd-cell title="审核意见" vertical prop="content">
        <wd-textarea
          v-model="model.acceptContent"
          :maxlength="300"
          :show-word-limit="true"
          placeholder="填写通过/驳回的情况回复信息，提交后无法修改，请确认后提交。"
        />
      </wd-cell>
    </view>
    <view class="py-20rpx px-30rpx bg-#E9F3FF">申请信息</view>
    <view v-if="menuName == '案件查询'">
      <view class="p-20rpx box-border">
        <view>
          <wd-cell>
            <template #title>
              <view>
                <view class="inline-block mr-10rpx">主体身份:</view>
                <view class="inline-block text-#5a5b5d">
                  {{ getApplicantType(caseData.applicantType) }}
                </view>
              </view>
            </template>
          </wd-cell>
        </view>
        <view>
          <wd-cell>
            <template #title>
              <view>
                <view class="inline-block mr-10rpx">被查询人姓名:</view>
                <view class="inline-block text-#5a5b5d">{{ caseData.partyName }}</view>
              </view>
            </template>
          </wd-cell>
          <wd-cell>
            <template #title>
              <view>
                <view class="inline-block mr-10rpx">被查询人身份证号:</view>
                <view class="inline-block text-#5a5b5d">{{ caseData.partyCard }}</view>
              </view>
            </template>
          </wd-cell>
        </view>
        <view>
          <wd-cell>
            <template #title>
              <view>
                <view class="inline-block mr-10rpx">申请人:</view>
                <view class="inline-block text-#5a5b5d">{{ caseData.applicant }}</view>
              </view>
            </template>
          </wd-cell>
          <wd-cell>
            <template #title>
              <view>
                <view class="inline-block mr-10rpx">申请人手机号码:</view>
                <view class="inline-block text-#5a5b5d">{{ caseData.applicantPhone }}</view>
              </view>
            </template>
          </wd-cell>
          <!-- <wd-cell>
            <template #title>
              <view>
                <view class="inline-block mr-10rpx">上传材料:</view>
                <view class="inline-block text-#5a5b5d">{{ caseData.applicantPhone }}</view>
              </view>
            </template>
          </wd-cell> -->
        </view>
        <view>
          <wd-cell>
            <template #title>
              <view>
                <view class="inline-block mr-10rpx">申请状态:</view>
                <view class="inline-block text-#5a5b5d">{{ getType(caseData.status) }}</view>
              </view>
            </template>
          </wd-cell>
          <wd-cell>
            <template #title>
              <view>
                <view class="inline-block mr-10rpx">审核说明:</view>
                <view class="text-#5a5b5d">
                  {{ caseData.acceptContent }}
                </view>
              </view>
            </template>
          </wd-cell>
        </view>
      </view>
    </view>
    <view v-else>
      <view class="px-30rpx py-20rpx" v-if="menuName != '羁押必要性审查'">
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">姓名:</view>
              <view class="inline-block text-#5a5b5d">{{ caseData.name }}</view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">
                {{ menuName == '信访服务' ? '信访内容' : '线索内容' }}:
              </view>
              <view class="inline-block text-#5a5b5d">
                {{ caseData.content }}
              </view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">上传相关资料:</view>
              <view class="text-#5a5b5d">
                <wd-img
                  v-for="(item, index) in filesList"
                  :width="100"
                  :height="100"
                  :src="baseUrl + item.url"
                  :enable-preview="true"
                />
              </view>
            </view>
          </template>
        </wd-cell>
        <!-- <wd-cell>
            <template #title>
              <view>
                <view class="inline-block mr-10rpx">主体身份:</view>
                <view class="inline-block text-#5a5b5d">当事人</view>
              </view>
            </template>
          </wd-cell> -->
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">提交时间:</view>
              <view class="inline-block text-#5a5b5d">
                {{ formatTime(caseData.createTime, 'yyyy-MM-dd HH:mm:ss') }}
              </view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">审核结果:</view>
              <view class="inline-block text-#5a5b5d">{{ getType(caseData.status) }}</view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">审核说明:</view>
              <view class="inline-block text-#5a5b5d">{{ caseData.acceptContent }}</view>
            </view>
          </template>
        </wd-cell>
      </view>
      <view class="px-30rpx py-20rpx" v-else>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">姓名:</view>
              <view class="inline-block text-#5a5b5d">{{ caseData.applicant }}</view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">主体身份:</view>
              <view class="inline-block text-#5a5b5d">
                {{ getApplicantType(caseData.applicantType) }}
              </view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">姓名:</view>
              <view class="inline-block text-#5a5b5d">{{ caseData.applicant }}</view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">被申请人姓名:</view>
              <view class="inline-block text-#5a5b5d">{{ caseData.applicant }}</view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">上传相关附件:</view>
              <view class="text-#5a5b5d">
                <view v-for="(item, index) in filesList" class="flex">
                  <view class="mr-20rpx max-w-[80%]">
                    {{ item.name }}
                  </view>
                  <wd-icon name="view" size="22px" @click="viewFileFn(item.url)"></wd-icon>
                  <!-- <wd-icon name="download" size="22px" @click="downloadFun(item.url)"></wd-icon> -->
                </view>
              </view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">提交时间:</view>
              <view class="inline-block text-#5a5b5d">
                {{ formatTime(caseData.createTime, 'yyyy-MM-dd HH:mm:ss') }}
              </view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">审核结果:</view>
              <view class="inline-block text-#5a5b5d">{{ getType(caseData.status) }}</view>
            </view>
          </template>
        </wd-cell>
        <wd-cell>
          <template #title>
            <view>
              <view class="inline-block mr-10rpx">审核说明:</view>
              <view class="inline-block text-#5a5b5d">{{ caseData.acceptContent }}</view>
            </view>
          </template>
        </wd-cell>
      </view>
    </view>
    <view class="footer w-80% mx-auto submit-but" v-if="shenheShow">
      <wd-button class="bg-#006EFF!" type="primary" size="medium" @click="submitHandler" block>
        提交
      </wd-button>
    </view>
  </view>
</template>
<script lang="ts" setup>
import { useToast } from 'wot-design-uni'
import Base64 from 'base-64'
import {
  getPublicAPI,
  getPetitionAPI,
  getCaseQueryAPI,
  getDetentionAPI,
  getFileistAPI,
  updateRecordAPI,
  updateDetentionAPI,
  updatePublicAPI,
  updatePetitionAPI,
} from '@/service/index/foo'
import { formatTime } from '@/utils/index'
import { useUserStore } from '@/store'
const userStore = useUserStore()
const toast = useToast()
const subId = ref()
const active = ref<number>(0)
const menuName = ref()
const shenheShow = ref(true)
const model = ref<any>({
  accept: true,
  reject: false,
  acceptContent: '',
})
onUnload(() => {
  uni.$emit('refreshPage')
})
const baseUrl = import.meta.env.VITE_SERVER_BASEURL
const typeList = [
  {
    value: 1,
    label: '审核中',
  },
  {
    value: 2,
    label: '审核通过',
  },
  {
    value: 3,
    label: '审核驳回',
  },
]
const promotionlist = ref<any[]>([
  {
    value: '1',
    label: '当事人',
  },
  {
    value: '2',
    label: '当事人法定代理人',
  },
  {
    value: '3',
    label: '当事人近亲属',
  },
  {
    value: '4',
    label: '辩护人',
  },
])
const getType = computed(() => {
  return function (index) {
    if (index != undefined) {
      return typeList.filter((item) => {
        return item.value == index
      })[0].label
    }
  }
})
const getApplicantType = computed(() => {
  return function (index) {
    if (index) {
      if (index != undefined) {
        return promotionlist.value.filter((item) => {
          return item.value == index
        })[0].label
      }
    }
  }
})
const caseData = ref({
  name: undefined,
  content: undefined,
  createTime: undefined,
  status: undefined,
  acceptContent: undefined,
  files: undefined,
  applicant: undefined,
  applicantPhone: undefined,
  partyCard: undefined,
  partyName: undefined,
  applicantType: undefined,
})
const businessList = {
  案件查询: 'anJian',
  信访服务: 'xinFang',
  公益诉讼: 'gongYi',
  羁押必要性审查: 'jiYa',
}
const filesList = ref([])
const menuList = {
  案件查询: getAnJianPage,
  信访服务: getXinFangPage,
  公益诉讼: getGongYiPage,
  羁押必要性审查: getJiYaPage,
}
onLoad((options) => {
  if (options.id) {
    subId.value = options.id
    options.state == 1 ? (shenheShow.value = true) : (shenheShow.value = false)
    menuName.value = options.menu
    menuList[options.menu](options.id)
    getFileistAPI({ businessId: options.id, businessType: businessList[options.menu] }).then(
      (res) => {
        filesList.value = res.data.list
      },
    )
  }
})
function getXinFangPage(id) {
  getPetitionAPI(id).then((res) => {
    caseData.value = Object.assign(unref(caseData), res.data)
  })
}
function getGongYiPage(id) {
  getPublicAPI(id).then((res) => {
    caseData.value = Object.assign(unref(caseData), res.data)
  })
}
function getJiYaPage(id) {
  getDetentionAPI(id).then((res) => {
    caseData.value = Object.assign(unref(caseData), res.data)
  })
}
function getAnJianPage(id) {
  getCaseQueryAPI(id).then((res) => {
    caseData.value = Object.assign(unref(caseData), res.data)
    caseData.value.applicantPhone = Base64.decode(caseData.value.applicantPhone)
  })
}
function viewFileFn(fileUrl) {
  // 文件url 文件名 文件后缀
  uni.showLoading({ title: '加载中…', mask: true })
  const downloadTask = uni.downloadFile({
    url: baseUrl + fileUrl,
    success: function (res) {
      console.log('downloadFile 成功', res)
      const tempFilePath = res.tempFilePath // 下载成功后的临时文件路径
      uni.openDocument({
        filePath: tempFilePath, // 打开新的文件路径
        showMenu: false,
        success: function (res) {
          console.log('openDocument 成功', res)
          uni.hideLoading()
        },
        fail: function (err) {
          console.log('openDocument 失败', err)
          uni.hideLoading()
        },
      })
    },
    fail: function (res) {
      console.log('downloadFile 失败', res)
      uni.hideLoading()
    },
  })
}
function downloadFun(fileUrl) {
  uni.showLoading({ title: '正在下载……' })

  // console.log(that.hostUrl + '/uploads'+ enclosure)
  uni.downloadFile({
    url: baseUrl + fileUrl, // 下载地址接口返回
    success: (data) => {
      console.log('打印data', data)
      if (data.statusCode === 200) {
        // 隐藏加载框
        uni.hideLoading()
        // 文件保存到本地
        uni.saveFile({
          tempFilePath: data.tempFilePath, // 临时路径
          success: function (res) {
            // console.log('打印res',res)
            uni.showToast({
              icon: 'success',
              mask: true,
              // title: '文件已保存：' + res.savedFilePath, //保存路径
              title: '下载成功',
              duration: 2000,
            })

            // 自动打开文档查看
            setTimeout(() => {
              const filePath = res.savedFilePath
              uni.openDocument({
                // 新开页面打开文档，支持格式：doc, xls, ppt, pdf, docx, xlsx, pptx。
                filePath,
                showMenu: true,
                success: function (res) {
                  console.log('打开文档成功')
                },
              })
            }, 2000)
          },
        })
      }
    },
    fail: (err) => {
      console.log(err)
      uni.showToast({
        icon: 'none',
        mask: true,
        title: '文件下载失败',
      })
    },
  })
}
function nextStep() {
  active.value = active.value + 1
}
function handleAccept(value) {
  model.value.reject = !value.value
}
function handleReject(value) {
  model.value.accept = !value.value
}
function submitHandler() {
  const params = {
    id: Number(subId.value),
    status: model.value.accept ? 2 : 3,
    acceptContent: model.value.acceptContent,
    acceptUserName: userStore.userInfo.nickname,
    acceptTime: new Date().getTime(),
  }
  if (menuName.value == '案件查询') {
    updateRecordAPI(params).then((res) => {
      if (res.code == 0) {
        toast.success({
          msg: '操作成功',
          duration: 0,
        })
        setTimeout(() => {
          uni.navigateBack({
            delta: 1,
          })
          toast.close()
        }, 1500)
      }
    })
  } else if (menuName.value == '公益诉讼') {
    updatePublicAPI(params).then((res) => {
      if (res.code == 0) {
        toast.success({
          msg: '操作成功',
          duration: 0,
        })
        setTimeout(() => {
          uni.navigateBack({
            delta: 1,
          })
          toast.close()
        }, 1500)
      }
    })
  } else if (menuName.value == '羁押必要性审查') {
    updateDetentionAPI(params).then((res) => {
      if (res.code == 0) {
        toast.success({
          msg: '操作成功',
          duration: 0,
        })
        setTimeout(() => {
          uni.navigateBack({
            delta: 1,
          })
          toast.close()
        }, 1500)
      }
    })
  } else if (menuName.value == '信访服务') {
    updatePetitionAPI(params).then((res) => {
      if (res.code == 0) {
        toast.success({
          msg: '操作成功',
          duration: 0,
        })
        setTimeout(() => {
          uni.navigateBack({
            delta: 1,
          })
          toast.close()
        }, 1500)
      }
    })
  }
}
</script>
<style lang="scss" scoped>
::v-deep .wd-cell__right {
  flex: none !important;
}
</style>
